import 'package:bigegg/entity/articel/xmm_article_info.dart';
import 'package:bigegg/entity/user/xmm_wall_user.dart';
import 'package:bigegg/global/routes/xmm_routes.dart';
import 'package:bigegg/global/user/xmm_account_manager.dart';
import 'package:bigegg/widget/xmm_widget.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../../../dialog/xmm_business_dialog.dart';
import '../../../res/xmm_img.dart';
import '../../../widget/image/xmm_circle_cached_network_image.dart';
import '../../widget/xmm_article_list_view.dart';

class XmmUserPersonPage extends StatefulWidget {
  const XmmUserPersonPage({super.key});

  @override
  State<StatefulWidget> createState() {
    return XmmUserPersonPageState();
  }
}

class XmmUserPersonPageState extends State<XmmUserPersonPage> {
  final user = XmmAccountManager.instance.findWallUser(Get.arguments).obs;

  Iterable<XmmArticleInfo> articleList = <XmmArticleInfo>[];

  @override
  void initState() {
    super.initState();
    articleList =
        XmmAccountManager.instance.findArticle(user.value.author ?? "");
  }

  void showGiftDialog() async {
    var isSucceed = await XmmBusinessDialog.showSendGiftDialog(user.value);
    if (isSucceed != null && isSucceed is bool && isSucceed) {
      user.refresh();
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: commonBgDecoration(),
        child: Stack(
          children: [
            Column(
              children: [
                toolBarWidget(
                  context,
                  "",
                  rightImage: XmmImg.moreIcon,
                  boxColor: Colors.white,
                  onRightTap: () {
                    XmmBusinessDialog.showMoreDialog(user.value.userId ?? "");
                  },
                ),
                SizedBox(height: 32.w),
                userHeadWidget(),
                SizedBox(height: 25.w),
                Container(color: const Color(0xFFEEEEEE), height: 1),
                enterPageToolsWidget(),
                Container(color: const Color(0xFFEEEEEE), height: 1),
                SizedBox(height: 24.w),
                Expanded(
                  child: Container(
                    color: const Color(0xFFF5F7F6),
                    child: Column(
                      children: [
                        tabWidget(),
                        SizedBox(height: 24.w),
                        getListWidget()
                      ],
                    ),
                  ),
                )
              ],
            ),
            Align(
              alignment: Alignment.bottomCenter,
              child: bottomToolsWidget(),
            )
          ],
        ),
      ),
    );
  }

  Widget userHeadWidget() {
    return Column(
      children: [
        SizedBox(
          width: 88.w,
          height: 88.w,
          child: XmmCircleCachedNetworkImage(
            imageUrl: user.value.getAvatarUrl ?? "",
            borderColor: Colors.white,
            borderWidth: 2,
          ),
        ),
        const SizedBox(height: 12),
        Container(
          margin: const EdgeInsets.only(left: 20, right: 20),
          child: Text(
            user.value.nickname ?? "",
            style: TextStyle(
              fontSize: 18.sp,
              color: const Color(0xFF404040),
              fontWeight: FontWeight.bold,
            ),
            maxLines: 1,
            overflow: TextOverflow.ellipsis,
            textAlign: TextAlign.center,
          ),
        ),
      ],
    );
  }

  Widget enterPageToolsWidget() {
    return Obx(
      () => Container(
        alignment: Alignment.center,
        height: 68.w,
        child: Row(children: [
          const Expanded(flex: 1, child: SizedBox()),
          toolsItemWidget(
            "assets/images/xmm_icon_gift_1.png",
            "${user.value.giftNumber1 ?? 0}",
          ),
          const Expanded(flex: 2, child: SizedBox()),
          toolsItemWidget(
            "assets/images/xmm_icon_gift_2.png",
            "${user.value.giftNumber2 ?? 0}",
          ),
          const Expanded(flex: 2, child: SizedBox()),
          toolsItemWidget(
            "assets/images/xmm_icon_gift_3.png",
            "${user.value.giftNumber3 ?? 0}",
          ),
          const Expanded(flex: 1, child: SizedBox()),
        ]),
      ),
    );
  }

  Widget toolsItemWidget(
    String image,
    String text,
  ) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Image.asset(
          image,
          width: 20.w,
          height: 20.w,
        ),
        const SizedBox(height: 12),
        Text(
          text,
          style: TextStyle(
            color: const Color(0xFF666666),
            fontSize: 12.sp,
          ),
        )
      ],
    );
  }

  Widget tabWidget() {
    return Container(
      height: 53.w,
      padding: const EdgeInsets.only(left: 20, right: 20),
      child: Row(
        children: [
          Expanded(
            child: Stack(
              alignment: AlignmentDirectional.center,
              children: [
                Row(
                  children: [
                    SizedBox(width: 21.w),
                    Image.asset(
                      "assets/images/xmm_icon_article_select.png",
                      width: 19.w,
                      height: 18.w,
                    ),
                    const SizedBox(width: 5),
                    Text(
                      "Post",
                      style: TextStyle(
                        fontSize: 16.sp,
                        color: const Color(0xFF202020),
                      ),
                    )
                  ],
                ),
                Align(
                  alignment: Alignment.bottomCenter,
                  child: Container(
                    color: const Color(0xFF404040),
                    height: 1,
                  ),
                )
              ],
            ),
          ),
          Expanded(
            child: Container(
              alignment: Alignment.bottomCenter,
              child: Container(
                color: const Color(0xFFEEEEEE),
                height: 1,
              ),
            ),
          )
        ],
      ),
    );
  }

  Widget getListWidget() {
    return Expanded(
      child: Column(
        children: [
          XmmArticleListView(
            articleList: articleList,
            paddingBottom: 59.w + MediaQuery.of(context).padding.bottom,
          ),
        ],
      ),
    );
  }

  Widget bottomToolsWidget() {
    return Container(
      padding: EdgeInsets.only(
        bottom: MediaQuery.of(context).padding.bottom,
      ),
      height: 49.w + MediaQuery.of(context).padding.bottom,
      decoration: const BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(12),
          topRight: Radius.circular(12),
        ),
        boxShadow: [
          BoxShadow(
            color: Color(0x24211F1E),
            offset: Offset(0, -5.0),
            blurRadius: 15.0,
            spreadRadius: 10,
          ),
        ],
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          GestureDetector(
            behavior: HitTestBehavior.opaque,
            onTap: () => showGiftDialog(),
            child: Container(
              width: 107.w,
              height: 28.w,
              decoration: BoxDecoration(
                color: const Color(0xFF15E8C2),
                borderRadius: BorderRadius.circular(4),
              ),
              child: Center(
                child: Image.asset(
                  "assets/images/xmm_icon_person_gift.png",
                  width: 22.w,
                  height: 22.w,
                ),
              ),
            ),
          ),
          SizedBox(width: 20.w),
          GestureDetector(
            behavior: HitTestBehavior.opaque,
            onTap: () =>
                Get.toNamed(XmmRoutes.chatPage, arguments: user.value.userId),
            child: Container(
              width: 152.w,
              height: 28.w,
              decoration: BoxDecoration(
                color: const Color(0xFF010101),
                borderRadius: BorderRadius.circular(4),
              ),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: const [
                  Text(
                    "Chat",
                    style: TextStyle(
                      fontSize: 18,
                      color: Colors.white,
                    ),
                  )
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}
